<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>信息修改</title>
    <!-- 引入 WeUI CDN 链接 -->
    <link rel="stylesheet" href="https://res.wx.qq.com/open/libs/weui/2.3.0/weui.min.css" />
</head>

<body>
    <!-- 个人资料 -->
    <div class="profile">
        <span class="iconfont icon-arrow1" id="arrow"></span>
        <p>个人资料</p>
    </div>
    <input type="file" id="upload" style="display: none;" />
    <!-- 表单 -->
    <div class="weui-cells">
        <div class="weui-cell weui-cell_active weui-cell_select" role="button" aria-haspopup="listbox">
            <div class="weui-cell__bd df jcsb avatar-box">
                <div class="weui-select">更换头像</div>
                <img id="avatar" class="avatar" alt="" />

            </div>
        </div>
        <!-- 昵称 -->
        <label for="nickname" class="weui-cell weui-cell_active weui-cell_wrap">
          <div class="weui-cell__hd">
            <span class="weui-label">昵称</span>
          </div>
          <div class="weui-cell__bd">
            <input
              id="nickname"
              class="weui-input weui-cell__control weui-cell__control_flex"
              placeholder="用户名"
            />
          </div>
        </label>
        <!-- 性别 -->
        <div id="showSexPicker" role="button" aria-haspopup="listbox" class="weui-cell weui-cell_active weui-cell_select weui-cell_select-after">
            <div class="weui-cell__hd"><label class="weui-label">性别</label></div>
            <div class="weui-cell__bd">
                <input class="weui-select" id="selSex" placeholder="请选择" />
                <!-- <div class="weui-select" id="selSex">男</div> -->
            </div>
        </div>
        <!-- 生日 -->
        <div class="weui-cell weui-cell_active weui-cell_select" role="button" aria-haspopup="listbox" id="showDatePicker">
            <div class="weui-cell__bd">
                <div class="weui-select">生日</div>
            </div>
        </div>
        <!-- 省份 -->
        <div id="showProvince" role="button" aria-haspopup="listbox" class="weui-cell weui-cell_active weui-cell_select weui-cell_select-after">
            <div class="weui-cell__hd"><label class="weui-label">省份</label></div>
            <div class="weui-cell__bd">
                <div class="weui-select">四川省</div>
            </div>
        </div>
        <!-- 城市 -->
        <div id="showCity" role="button" aria-haspopup="listbox" class="weui-cell weui-cell_active weui-cell_select weui-cell_select-after city">
            <div class="weui-cell__hd"><label class="weui-label">城市</label></div>
            <div class="weui-cell__bd">
                <div class="weui-select">成都市</div>
            </div>
        </div>
        <!-- 个人简介 -->
        <div class="weui-cells__group weui-cells__group_form">
            <div class="title"><span class="displayB">个人简介</span></div>
            <div class="">
                <div class="">
                    <div class="">
                        <textarea class="weui-textarea" placeholder="多行输入" rows="3"></textarea>
                        <div role="option" aria-live="polite" class="weui-textarea-counter">
                            <span>0</span> /140
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 保存信息 -->
        <div class="weui-form__opr-area">
            <a role="button" class="weui-btn weui-btn_primary" href="javascript:" id="showTooltips">
            保存信息
          </a>
        </div>
    </div>
    <script src="https://res.wx.qq.com/open/libs/weuijs/1.2.1/weui.min.js" charset="utf-8"></script>
</body>

</html>